'use strict'

function Clock(width,height) {
    var seconds;
	var minutes;
	var hours;
	var width,height;
	
	this.width= width;
	this.height = height;
	
	this.setSeconds = function(s){
		this.seconds = s;
	}
	
	this.setMinutes = function(m){
		this.minutes = m;
	}	
	
	this.setHours = function(h){
		this.hour = h;
	}
	
	this.drawSeconds = function(ctxt,seconds,minutes,hours,){
		this.drawSecondsMinutesInCanvas(ctxt,seconds,minutes,hours);
	}	
	
	
	this.drawSecondsMinutesInCanvas = function(cxt,seconds,minutes,hours){
		
        function drawMinutesInCanvas(cxt,min,hours){	

            function drawHoursInCanvas(cxt,hours){
				// 将图像绘制到canvas上
		        cxt.save();
		        cxt.translate(200,320);
		        console.log("5. hours is:"+hours);
		        cxt.rotate(hours*30*Math.PI/180);		
		        var imageHours = new Image();
		        imageHours.onload = function(){
		           cxt.moveTo(0,0);
	               cxt.drawImage(imageHours, -40, 0, imageHours.width,-imageHours.height*0.6); 		    	
                   cxt.restore();    			
		        }
		        imageHours.src="oldStyleClock_sec_5.png";			
			}

		
	        // 将图像绘制到canvas上
		    cxt.save();
		    cxt.translate(200,320);
		    console.log("4. minutes is:"+min);
		    cxt.rotate(min*6*Math.PI/180);		
		    var imageMinutes = new Image();
		    imageMinutes.onload = function(){
		       cxt.moveTo(0,0);
			   console.log("6. minutes width is:"+imageMinutes.width+"，minutes height is:"+imageMinutes.height+".");
	           cxt.drawImage(imageMinutes, -40, 0, imageMinutes.width,-imageMinutes.height*0.8); 		    	
               cxt.restore(); 
               drawHoursInCanvas(cxt,hours);			   
		    }
		    imageMinutes.src="oldStyleClock_sec_5.png";
		}
		
		console.log("1. seconds is:"+seconds+", minutes is:"+minutes + ",hours is:"+hours); 
		// 将图像绘制到canvas上
		cxt.save();
		cxt.translate(200,320);
		
		
		
		/* cxt.beginPath();
		cxt.moveTo(0,0);
		cxt.lineTo(0,100);
		cxt.moveTo(0,0);
		cxt.lineTo(100,0);
		cxt.moveTo(100,0);
		cxt.lineTo(100,100);
		cxt.lineWidth = 7;
        cxt.strokeStyle = "#000";
		cxt.stroke();
		cxt.closePath(); */
		
		
	    cxt.rotate((this.seconds)*6*Math.PI/180);       	
//        cxt.rotate(30*6*Math.PI/180);
          
		var image = new Image();
		image.onload = function(){
			console.log("2. minutes is:"+minutes + ",hours is:"+hours); 
			cxt.moveTo(0,0);
	        cxt.drawImage(image, -40, 0, image.width,-image.height ); 		    	
            cxt.restore();  
			console.log("3. minutes is:"+minutes + ",hours is:"+hours);
            drawMinutesInCanvas(cxt,minutes,hours);    			
		}
		image.src="oldStyleClock_sec_5.png";	    
    }


    
	
	this.drawSkeleton = function(cxt){
        for(var i=0; i<12; i++) {
            cxt.save();
            cxt.lineWidth = 7;
            cxt.strokeStyle = "#000";
            cxt.translate(250,250);
            cxt.rotate(i*30*Math.PI/180);
            cxt.beginPath();
            cxt.moveTo(0,-170);
            cxt.lineTo(0,-190);
            cxt.stroke();
            cxt.closePath();
            cxt.restore();
        }
        // 时刻度结束

        // 分刻度开始
        for(var i=0; i<60; i++) {
            cxt.save();
            cxt.lineWidth = 5;
            cxt.strokeStyle = "#000";
            cxt.translate(250,250);
            cxt.rotate(i*6*Math.PI/180);
            cxt.beginPath();
            cxt.moveTo(0,-180);
            cxt.lineTo(0,-190);
            cxt.stroke();
            cxt.closePath();
            cxt.restore();
        } 
        // 分刻度结束
	}	
	
    this.hello = function () {
        alert('Hello, x:' + 200*Math.sin(2*Math.PI*10*6/360)+',y:'+(-200*Math.cos(2*Math.PI*10*6/360))+ '!');
    }
}